import { Table, Tooltip } from 'antd';

interface DataSource {
  key: React.Key;
  name: string;
  age: number;
  address: string;
}

const dataSource: DataSource[] = [
  {
    key: '1',
    name: '胡彦斌',
    age: 32,
    address: '西湖区湖底公园1号',
  },
  {
    key: '2',
    name: '胡彦祖',
    age: 42,
    address: '西湖区湖底公园1号西湖区湖底公园1号西湖区湖底公园1号',
  },
];

const columns = [
  {
    title: '姓名',
    dataIndex: 'name',
    key: 'name',
  },
  {
    title: '年龄',
    dataIndex: 'age',
    key: 'age',
  },
  {
    title: '住址',
    dataIndex: 'address',
    key: 'address',
    ellipsis: {
      showTitle: false,
    },
    render: (address:string) => (
      <Tooltip placement="topLeft" title={address}>
        {address}
      </Tooltip>
    )
  },
];

const BasicTable = () => (
  <Table dataSource={dataSource} columns={columns} />
)

export default BasicTable;